import React from 'react'
import PropTypes from 'prop-types'
import { Table, Modal, Button, Icon } from 'antd'
import styles from './index.less'
import classnames from 'classnames'
import { AnimTableBody } from '../../components'
import { DropOption } from '../../components'

const confirm = Modal.confirm




class list extends React.Component {
  state = {
    selectedRowKeys: [],  // Check here to configure the default column
    loadingDel: false,
  };

  render() {
    const {
       pagination,dataSource,onPageChange ,onDetail,onEdit,loading,location
      } = this.props
    const columns = [
      {
        title: '发布人姓名',
        dataIndex: 'releasersName',
        key: 'releasersName',
      },{
        title: '出发地区',
        dataIndex: 'startPlace',
        key: 'startPlace',
      },{
        title: '订单编号',
        dataIndex: 'orderSerial',
        key: 'orderSerial',
      },{
        title: '收货人',
        dataIndex: 'consigneeName',
        key: 'consigneeName',
      },{
        title: ' 收货人联系方式',
        dataIndex: 'consigneeMobile',
        key: 'consigneeMobile',
      }, {
        title: '发货时间',
        dataIndex: 'deliveryDateTime',
        key: 'deliveryDateTime',
        render:(text) => <span>{text = new Date(text).toLocaleString()}</span>
      },{
        title: '操作',
        key: 'operation',
        width: 100,
        render: (text, record) => {
          return <DropOption onMenuClick={e => handleMenuClick(record, e)} menuOptions={[{ key: '1', name: '修改状态' }, { key: '2', name: '详细' }]} />
        },
      },
    ]
    const onChange =(e)=>{
      const data = {
        page:JSON.stringify( e.current),
        pageSize:e.pageSize
      }
      onPageChange(data)
    }
    const onRowDoubleClick =(record)=>{
      onDetail(record)
    }
    const handleMenuClick = (record, e) => {
      if (e.key === '1') {
        onEdit(record)
      } else if (e.key === '2') {
        onDetail(record)
      }
    }

    return (
      <div>
      <div className={styles.filterTop}>
        <div className={styles.title}><span style={{marginRight:20}}>全部订单</span></div>
        <div className={styles.Searchright}>
        </div>
      </div>
      <div className={styles.listbox}>
        <div>
          <Table
            className={styles.table}
            bordered
            scroll={{ x: 750, y:600 }}
            columns={columns}
            dataSource={dataSource}
            loading={loading}
            onChange={onChange}
            pagination={pagination}
            onRowDoubleClick={onRowDoubleClick}
            simple
            rowKey={record => record.id}
          />
        </div>
      </div>
      </div>
    );
  }
}

list.propTypes = {
  loading: PropTypes.bool,
  dataSource: PropTypes.array,
  pagination: PropTypes.object,
  onPageChange: PropTypes.func,
  onDeleteItem: PropTypes.func,
  onEditItem: PropTypes.func,
  isMotion: PropTypes.bool,
  location: PropTypes.object,
}

export default list
